// Copyright 2015 Google Inc. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//     http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

// Function
//-- Must be defined before variables
@function rem($multiplier) {
  $font-size: 10px;
  @return $multiplier * $font-size;
}

$display-4-font-size-base: rem(11.2) !default;
$display-1-font-size-base: rem(3.4) !default;
$headline-font-size-base:  rem(2.4) !default;
$title-font-size-base:  rem(2) !default;
$subhead-font-size-base-lg: rem(1.8) !default;
$subhead-font-size-base:   rem(1.6) !default;
$body-font-size-base:      rem(1.4) !default;
$caption-font-size-base:   rem(1.2) !default;
$toolbar-height-size-base: rem(6.4) !default;
$toolbar-height-size-base-sm: rem(4.8) !default;
$footer-font-size-base:   rem(1) !default;
$font-family-monospace: 'Roboto Mono Regular', monospace;
$font-family-medium-monospace: 'Roboto Mono Medium', monospace;
$font-family-medium: 'Roboto-Medium';

$primary: #326de6;
$secondary: #f51200;
$warning: #ffa500;
$delicate: #aaa;
$border: rgba(0, 0, 0, .12);
$border-solid: rgba(0, 0, 0, .38);
$muted: #888;
$hover-primary: #1254df;
$hover-secondary: #ff1c19;
$body: #eee;
$emphasis: #000;
$content-background: #fff;
$chart-1: #00c752;
$chart-2: #326de6;
$success-color: #008000;
$error-color: #ff5722;

// TODO(bryk): Get those variables from Angular Material scss files.
$foreground-1: rgba(0, 0, 0, .87);
$foreground-2: rgba(0, 0, 0, .54);
$foreground-3: rgba(0, 0, 0, .38);
$foreground-4: rgba(0, 0, 0, .12);
$hue-1: rgba(255, 255, 255, .87);
$hue-2: rgba(255, 255, 255, .54);
$hue-3: rgba(255, 255, 255, .26);
$hue-4: rgba(255, 255, 255, .12);

$background-1: rgba(158, 158, 158, .2);
$overlay-color: $hue-2;

$regular-font-weight: 400;
$bold-font-weight: 500;
$light-font-weight: 300;

$layout-breakpoint-lg: 1280px;
$layout-breakpoint-sm: 960px;
$layout-breakpoint-xs: 600px;
$whiteframe-shadow-1dp: 0 1px 3px 0 rgba(0, 0, 0, .2), 0 1px 1px 0 rgba(0, 0, 0, .14), 0 2px 1px -1px rgba(0, 0, 0, .12);
$baseline-grid: 8px;
$nav-width: 30 * $baseline-grid;
$logo-width: 8 * $baseline-grid;
$logo-height: 8 * $baseline-grid;
$table-cell-height: 6 * $baseline-grid;
$table-cell-height-half: $table-cell-height / 2;
